<!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="Bookmark" href="/favicon.ico" >
<link rel="Shortcut Icon" href="/favicon.ico" />
<!--[if lt IE 9]>
<script type="text/javascript" src="/admin/lib/html5shiv.js"></script>
<script type="text/javascript" src="/admin/lib/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="/admin/static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="/admin/static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="/admin/lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="/admin/static/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="/admin/static/h-ui.admin/css/style.css" />

<link rel="stylesheet" type="text/css" href="/statics/webuploader-0.1.5/webuploader.css" />
<!--[if IE 6]>
<script type="text/javascript" src="/admin/lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<!--/meta 作为公共模版分离出去-->



<title>添加用户 - H-ui.admin v3.1</title>
<meta name="keywords" content="H-ui.admin v3.1,H-ui网站后台模版,后台模版下载,后台管理系统模版,HTML后台模版下载">
<meta name="description" content="H-ui.admin v3.1，是一款由国人开发的轻量级扁平化网站后台模板，完全免费开源的网站后台管理系统模版，适合中小型CMS后台系统。">
</head>
<body>
<article class="page-container">
	<form action="" method="post" class="form form-horizontal" id="form-member-add">
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>用户名：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" value="" placeholder="" id="username" name="username">
			</div>
		</div>

		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>性别：</label>
			<div class="formControls col-xs-8 col-sm-9 skin-minimal">
				<div class="radio-box">
					<input name="gender" value="1" type="radio" id="gender-1" checked>
					<label for="gender-1">男</label>
				</div>
				<div class="radio-box">
					<input type="radio" id="gender-2" name="gender" value="2">
					<label for="gender-2">女</label>
				</div>
				<div class="radio-box">
					<input type="radio" id="gender-3" name="gender">
					<label for="gender-3">保密</label>
				</div>
			</div>
		</div>
		
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>手机：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" value="" placeholder="" id="mobile" name="mobile">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>邮箱：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<input type="text" class="input-text" placeholder="@" name="email" id="email">
			</div>
		</div>
		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3">头像：</label>
			<div class="formControls col-xs-8 col-sm-9">
				<div id="uploader-demo">
    <!--用来存放item-->
			    <div id="fileList" class="uploader-list"></div>
			    <input type="hidden" name="avatar" value="/statics/avatar.jpg" />
			    <div id="filePicker">选择图片</div>
			</div>
			

			</div>
		</div>
	

	
   <div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>所属地区：</label>
		
		<div id="demo3" class="citys" >
	    <div class="formControls col-xs-8 col-sm-9" > 
	    
		<select  class="select-box" style="width:150px;" name="province" id="province" size="1" ></select>
		
		
		<select  name="city" class="select-box" style="width:110px;"></select>
		
		
		<select name="area" class="select-box" style="width:110px;"></select>
	   
	    
		<select  name="town" class="select-box" style="width:110px;"></select>
		
		
	 		
   		</div>
		</div>	
	</div>


		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>账号类型：</label>
			<div class="formControls col-xs-8 col-sm-9 skin-minimal">
				<div class="radio-box">
					<input name="type" type="radio" id="type-1" value="1" checked>
					<label for="type-1">学生</label>
				</div>
				<div class="radio-box">
					<input type="radio" id="type-2" value="2" name="type">
					<label for="type-2">老师</label>
				</div>
			
			</div>
		</div>

		<div class="row cl">
			<label class="form-label col-xs-4 col-sm-3"><span class="c-red">*</span>账号状态：</label>
			<div class="formControls col-xs-8 col-sm-9 skin-minimal">
				<div class="radio-box">
					<input name="status" type="radio" id="status-1" value="2" >
					<label for="status-1">禁用</label>
				</div>
				<div class="radio-box">
					<input type="radio" id="status-2" value="1" name="status" checked>
					<label for="status-2">启用</label>
				</div>
			
			</div>
		</div>

		<div class="row cl">
			<div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
				<input class="btn btn-primary radius" type="submit" value="&nbsp;&nbsp;提交&nbsp;&nbsp;">
			</div>
		</div>
		{{csrf_field()}}
	</form>
</article>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="/admin/lib/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript" src="/admin/lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="/admin/static/h-ui/js/H-ui.min.js"></script> 
<script type="text/javascript" src="/admin/static/h-ui.admin/js/H-ui.admin.js"></script> <!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本--> 
<script type="text/javascript" src="/admin/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/jquery.validate.js"></script> 
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/validate-methods.js"></script> 
<script type="text/javascript" src="/admin/lib/jquery.validation/1.14.0/messages_zh.js"></script>
<script type="text/javascript" src="/admin/jquery.cities.js"></script>
<script type="text/javascript" src="/statics/webuploader-0.1.5/webuploader.js"></script>
<script type="text/javascript" src="/statics/avatar.js"></script>
<script type="text/javascript">
$(function(){

	
	$('.skin-minimal input').iCheck({
		checkboxClass: 'icheckbox-blue',
		radioClass: 'iradio-blue',
		increaseArea: '20%'
	});
	
	$("#form-member-add").validate({
		rules:{
			username:{
				required:true,
				minlength:2,
				maxlength:20
			},
			gender:{
				required:true,
			},
			type:{
				required:true,
			},
			mobile:{
				required:true,
				isMobile:true,
			},
			email:{
				required:true,
				email:true,
			},

			
		},
	
		onkeyup:false,
		focusCleanup:true,
		success:"valid",
		submitHandler:function(form){
				$(form).ajaxSubmit({
				type: 'post',
				url: "" ,
				success: function(data){
					if (data == '1'){
					layer.msg('添加成功!',{icon:1,time:1000},function(){
						var index = parent.layer.getFrameIndex(window.name);
						// parent.$('.btn-refresh').click();
						parent.window.location = parent.window.location;
						parent.layer.close(index);

					});

				}else{
					layer.msg('添加失败!',{icon:2,time:2000});
				  }
					
				},
                error: function(XmlHttpRequest, textStatus, errorThrown){
					layer.msg('error!',{icon:2,time:1000});
				}
			});
		}
	});
});
</script> 


<script type="text/javascript">
	var selectedAddress = {'province':'', 'city':'', 'area':'', 'town':''};
	var $town = $('select[name="town"]');
	var clearTown = function(){
		$town.hide().empty();
	}
	var townFormat = function(info){
		clearTown();
		if(info['code']%1e4&&info['code']<7e5){	//是否为“区”且不是港澳台地区
			$.ajax({
				url:'http://passer-by.com/data_location/town/'+info['code']+'.json',
				dataType:'json',
				success:function(town){
					$town.show();
					$town.append('<option value=""> - 街道、乡镇 - </option>');
					for(i in town){
						$town.append('<option value="'+i+'">'+town[i]+'</option>');
					}
				}
			});
		}
	};
	$('#demo3').citys({
		onChange: function(info){
			clearTown();
			selectedAddress.province = info.province;
			selectedAddress.city = info.city;
			selectedAddress.area = info.area;
		},
		onAreaChange:function(info){
			townFormat(info);
		}
	},function(api){
		var info = api.getInfo();
		townFormat(info);
	});
	$town.on('change', function(){
		selectedAddress.town = $(this).find("option:selected").text();
	});

        // console.log(selectedAddress); //输出最终选择的省、市、区县、街道
</script>





<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>